<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        // double-ended queue
        class DeQueue {
            // 存储队列信息  此处用对象存储队列 是为了删除的时候 相比较于数组的删除更加节省性能
            #items = {};
            // 队头索引
            #lowCount = 0;
            // 队尾索引
            #count = 0;

            // 出队头
            removeFront() {
                // 如果队列为空 则 直接中断出队操作
                if (this.isEmpty()) {
                    return undefined;
                }
                // 获取队头元素 存入变量中 用于取出
                let res = this.#items[this.#lowCount];
                // 删除队头元素
                delete this.#items[this.#lowCount];
                // 队头元素索引加一
                this.#lowCount++;
                // 返回出队列的元素
                return res;
            }
            // 从队头添加
            addFront(data) {
                //1.如果为空
                if (this.isEmpty()) {
                    // 如果队列为空，直接调用 addBack 方法添加元素
                    this.addBack(data);
                } else {
                    // 2.lowCount>0 队头索引大于 0 
                    if (this.#lowCount > 0) {
                        this.#lowCount --;
                        this.#items[this.#lowCount] = data;
                    } else {
                        // 队头索引小于等于 0   索引不能为负值 所以只能 在添加的时候将 添加前的 队列元素 全部后移 一位
                        for (let i = this.#count; i > 0; i--) {
                            this.#items[i] = this.#items[i - 1];
                        }
                        this.#items[0] = data;
                        this.#count++;
                    }

                }
            }
            // 从队尾删除
            removeBack() {
                //1.如果为空
                if (this.isEmpty()) {
                    return;
                }
                // 队尾索引 减1
                this.#count --;
                // 保存一下队尾元素 用于返回
                const res = this.#items[this.#count];
                // 删除队尾元素
                delete this.#items[this.#count];
                // 返回队尾元素
                return res;
            }
            // 入队尾
            addBack(data) {
                this.#items[this.#count] = data;
                this.#count++;
            }
            // 获取队头元素
            peekFront() {
                return this.#items[this.#lowCount];
            }
            // 获取队尾元素
            peekBack() {
                //1.如果为空
                if (this.isEmpty()) {
                    return;
                }
                return this.#items[this.#count - 1];
            }
            // 队列的大小
            size() {
                return this.#count - this.#lowCount;
            }
            // 判断队列是否为空
            isEmpty() {
                return this.size() === 0;
            }

            // 清空队列
            clear() {
                // 队列信息清空
                this.#items = {};
                // 队头索引 归零
                this.#lowCount = 0;
                // 队尾索引 归零
                this.#count = 0;
            }

            // 转换为字符串
            toString() {
                // 声明一个空字符串变量
                let str = '';
                // 遍历从 头部索引 his.#lowCount到 队尾索引 this.#count 之间的元素，将每个元素添加到str中
                for (let i = this.#lowCount; i < this.#count; i++) {
                    str += `${this.#items[i]},`;
                }
                // 删除字符串str的最后一个字符
                str = str.slice(0, -1);
                return str;
            }
        }
        const dequeue = new DeQueue();
        dequeue.addBack(1);
        dequeue.addBack(12131);
        dequeue.addBack(121311);
        dequeue.addBack(121);
        dequeue.addBack(12131134);
    </script>
</body>

</html>